<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
    <title>内容</title>
    <script type="text/javascript" src="/static/js/jquery-3.4.1.js"></script>

    <link rel="stylesheet" type="text/css" href="/static/css/content.css"/>


</head>
<body style="background-color:#f3f3f3;">
<div class="all">
    <div class="content">
        <div class="left">
            <table id="table1">
                <tbody id="group_one">
                <!-- 遍历list -->
                <c:forEach items="${posts}" var="post">
                    <tr style="height: auto">
                        <td class="left-td-top">

                            <div class="div-namelogo">
                                <a href="#">
                                    <img class="img" src="${post.user.userPhoto}" alt="用户头像"/>
                                </a>
                            </div>
                            <div class="div-name">
                                <a href="others/others.jsp?uid=${post.userId}">
                                    <span class="yansebianhuan">${post.user.userName}</span>
                                </a>
                            </div>
                            <div class="div-title">
                                <a
                                        href="postContent?postId=${post.postId}"><span
                                        class="yansebianhuan">${post.postTitle}</span></a>
                            </div>
                            <div class="div-content-icon">
                                <a href="#"><img class="img" src="${post.postPhoto}"
                                                 alt="内容配图"/></a>
                            </div>
                            <div class="div-content">
									<span>
                                            ${post.postContent}
                                    </span>
                            </div>
                            <div class="div-tail">
                                <a href="postContent?postId=${post.postId}" class="yansebianhuan">回复</a>&nbsp;&nbsp;&nbsp;
                                <a href="#" class="yansebianhuan">分享</a>&nbsp;&nbsp;&nbsp;
                                <a href="#" class="yansebianhuan">收藏</a>&nbsp;&nbsp;&nbsp;
                                <a href="#" class="yansebianhuan">举报</a>
                            </div>
                        </td>
                    </tr>
                    <tr style="height: auto">
                        <td class="left-td-botton"></td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
            <span id="s"></span>
            <table align="center" class="last-fenye">
                <tr>
                    <td>
                        <a href="#" onclick="postsRequest(1)" class="yanselast">首页</a>
                        &nbsp;
                    </td>
                    <td>
                        <a href="#" onclick="pagePrevious()" class="yanselast">上一页</a>
                        &nbsp;
                    </td>
                    <td>
                        <input type="text" id="seek" style="width: 25px;" value="${page}"/>
                        <a href="#"
                           onclick="pageSeek()"
                           class="yanselast">跳转</a>
                        &nbsp;
                    </td>
                    <td>
                        <a href="#" onclick="pageNext()" class="yanselast">下一页</a>
                    </td>
                </tr>
            </table>
            <br><br>
        </div>
    </div>
</div>
</body>
<script>
    if ($('#seek').val() == "") {
        postsRequest(1)
    }

    function postsRequest(number) {
        $.ajax({
            url: '/content',
            method: 'get',
            data: {
                number: number,
            },
            dataType: 'json',
            success: function (data) {
                console.log(data.info);
                if (data.info == "页数有误") {
                    alert("页数有误")
                }
                window.location.reload()
            },
            error: function () {
                alert("请求出错")
            },
            complete: function () {

            }
        })
    }

    function pageNext() {
        postsRequest(${page}+1)
    }

    function pagePrevious() {
        postsRequest(${page}-1)
    }

    function pageSeek() {
        postsRequest($('#seek').val())
    }
</script>
</html>